<template>
  <view class="page">
    <!-- 公共组件-每个页面必须引入 -->
    <public-module></public-module>

    <view v-if="loadstatus == false">
      <view class="u-padding-20">
        <!--view class="titleBox u-flex" style="border: none; padding-bottom: 0">
          <view class="title u-text-center">{{ info.name }}</view>
        </view-->
        <view class="content">
          <u-parse :content="info.content" :selectable="true" :tagStyle="style"></u-parse>
          <view v-for="(img, index) in info.imgs" :key="index" v-if="info.imgs.length > 0">
            <image style="width: 98%;margin: 1%;" mode="widthFix" :src="img.file_url" @click="preview(img.file_url)"></image>
          </view>
        </view>
      </view>

      <u-gap height="8" bg-color="#f3f4f6" v-if="info.accord_id > 1"></u-gap>
      <ygcComment
        ref="ygcComment"
        :placeholder="'高楼平地起，评论全靠您~'"
		:commenttitle="'提提意见'"
        :root_id="info.accord_id"
        :module="module"
        v-if="info.accord_id > 1"
      ></ygcComment>

    </view>

    <view class="u-margin-20" v-else>
      <u-gap height="10"></u-gap>
      <u-skeleton :loading="loadstatus" :animate="true" rows="10" avatar></u-skeleton>
    </view>
  </view>
</template>

<script>
import { mapState, mapMutations } from "vuex";
import ygcComment from "@/components/ygc-comment/ygc-comment.vue";
import { api_content_info, api_accord_info } from "@/config/api.js";

export default {
  components: {
    ygcComment,
  },
  data() {
    return {
      info: {
        category_name: "Loading",
        update_time: 0,
        hits: 0,
        distance: 0,
      },
      slide: [],
      loadStatus: "loadmore",
      loadstatus: true,
      loadstxt: "loading...",
      id: "",
      unique: "",
      module: "accord",
      style: {
        p: "font-size:32rpx",
        span: "font-size: 30rpx",
      },
    };
  },
  computed: {
    ...mapState(["userInfo"]),
  },
  onLoad(options) {
    this.id = options.id;
    this.unique = options.unique;
    this.getpagecontrac();
  },

  methods: {
    preview(current) {
      let prewimg = this.info.imgs.map((item) => item.file_url);
      uni.previewImage({
        urls: prewimg,
        current: current,
      });
    },
    getpagecontrac() {
      this.loadstatus = true;
      api_accord_info({
        accord_id: this.id,
        unique: this.unique,
        location: {},
      })
        .then((res) => {
          console.log(res);
          this.info = res;
          console.log(this.info);
          uni.setNavigationBarTitle({ title: res.name });
          // this.slide=[];
          // let imglist = res.data.img;
          //  for (let i = 0; i < imglist.length; i++) {
          // 	this.slide.push(imglist[i].pic);
          // }
          this.loadstatus = false;
        })
        .catch((e) => {});
    },
  },
};
</script>
<style lang="scss" scoped>
	.page{
		background: #fff;
	}
.content {
  color: #666666;
  line-height: 180%;
  font-size: 16px;
}
</style>
